<template>
	<view>
		<view style="background-color: white;">
			<u-tabs :list="list" @change="change" :activeStyle="{color: '#000',fontWeight: 'bold',transform: 'scale(1.05)'}"></u-tabs>
		</view>
		<view>
			<view v-if="data.length == 0">
				<u-empty
				        mode="order"
				        icon="http://cdn.uviewui.com/uview/empty/car.png"
				>
				</u-empty>
			</view>
			<view v-for="(item,index) in data" :key="index">
				<orderListItem :item="item"></orderListItem>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getOrderList,
	} from '../../utils/http/http.js';
	import orderListItem from "@/components/layout/orderListItem.vue"
	export default {
		components: {
			orderListItem
		},
		data() {
			return {
				user: {},
				type:'',
				data:[],
				onloadData :{},
				page:1,
				onload:'',
				list: [{
						'name': '全部',
						'type':''
					},
					{
						'name': '进行中',
						'type':'open'
					},
					{
						'name': '已完成',
						'type':'finish',
					}
				]
			}
		},
		async onLoad(options) {
			this.onloadData = options
		},
		async onShow() {
			this.getList()
		},
		methods: {
			async getList(){
				uni.showLoading({
					title:'加载中'
				})
				let params = {
					'type':this.type,
					'page':this.page,
				}
				params = {...params,...this.onloadData}
				const res = await getOrderList(params);
				uni.hideLoading()
				this.data = this.data.concat(res.data.data) 
			},
			
			async change(e){
				this.page = 1;
				this.data = [];
				this.type = e.type
				this.getList()
				
			},
			onReachBottom () {
				this.page ++;
				this.getList();
			},
			onPullDownRefresh(){
				this.page = 1;
				this.data = [];
				this.getList()
				uni.stopPullDownRefresh()
			}
		}

	}
</script>